<!DOCTYPE html>
<html lang="en">
        <head>
            <meta charset="UTF-8">
            <meta http-equiv="X-UA-Compatible" content="IE=edge">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <title>发微博</title>
        </head>
        <style>
            *{
                margin: 0px;
                padding: 0px;
                list-style: none;
            }
            body{
                background: rgb(49, 47, 47);
            }
            textarea{
                width: 500px;
                margin: 10px auto;
                display: block;
                resize: none;
                outline: none;
                border-radius: 20px;
            }
            button{
                width: 500px;
                margin: 10px auto;
                display: block;
                background: #606060;
                border: none;
                cursor: pointer;
                line-height: 40px;
                color: violet;
                border-radius: 50px;
            }
            ul{
                width: 500px;
                margin: 10px auto;
                display: block;
            }
            li{
                background: yellow;
                padding: 10px;
                margin-bottom: 10px;
                position: relative;
                border-radius: 10px;
            }
            span{
                position: absolute;
                right: -6px;
                top:-6Px;
                cursor: pointer;
                color:rgb(241, 232, 232);
            }
        </style>
        <body>
            <textarea name="" id="two2" cols="30" rows="10"></textarea>
            <button id="two1">发微博</button>
            <ul id="two3">
                <li>
                      端午佳节
                      <p>2021-06-12</p>
                      <span onclick="del(this)">X</span>
                </li>
            </ul>
            <script>
                var two1=document.getElementById("two1");
                var two2=document.getElementById("two2");
                var two3=document.getElementById("two3");
                var two4=document.getElementById("two4");

                two1.onclick=function(){

                    if(two2.value==''){
                        alert('亲！您忘记填内容了')
                    }else
                    {
                        var tag=document.createElement('li');

                        tag.innerHTML=`${two2.value}
                        <p>2021-06-12</p>
                      <span onclick="del(this)">X</span>`;
                      two3.appendChild(tag);

                      two2.value=''
                    }
                }
                      function del(a)
                      {
                          a.parentNode.parentNode.removeChild(a.parentNode)
                      }
                    
                 
            </script>
        </body>
        </html>